﻿
<!DOCTYPE html>
<html>
<head>
    <title>JavScraper 配置</title>
</head>
<body>
    <div data-role="page" class="page type-interior pluginConfigurationPage JavScraperConfigurationPage" data-require="emby-input,emby-button,emby-select,emby-checkbox,emby-linkbutton,emby-collapse">
        <div data-role="content">
            <div class="content-primary">

                <div class="verticalSection verticalSection">
                    <div class="sectionTitleContainer flex align-items-center">
                        <h2 class="sectionTitle">JavScraper 配置</h2><span id="current_version" name="current_version" is="emby-linkbutton" class="emby-button"></span>
                        <a is="emby-linkbutton" class="raised button-alt headerHelpButton emby-button" target="_blank" href="https://javscraper.com/">帮助</a>
                        <a is="emby-linkbutton" class="raised button-alt headerHelpButton emby-button" target="_blank" href="https://github.com/JavScraper/Emby.Plugins.JavScraper">源码</a>
                    </div>
                </div>

                <div class="readOnlyContent">
                    <p class="description1">
                        日本电影刮削器插件，用于从某些网站采集影片信息。
                        <a is="emby-linkbutton" target="_blank" href="https://javscraper.com/" class="button-link emby-button">了解更多</a>
                    </p>
                </div>

                <form class="JavScraperConfigurationForm">

                    <div class="infoBanner">
                        <p class="description1" id="update" name="update">
                            <a is="emby-linkbutton" target="_blank" href="https://github.com/JavScraper/Emby.Plugins.JavScraper/releases/latest" class="button-link emby-button">正在检查新版本...</a>
                        </p>
                        <p class="description1" id="update0" name="update0" style="display: none;">
                            检查新版本或者更新失败，请稍后再试。<span id="update_error" name="update_error"></span>
                        </p>
                        <p class="description1" id="update1" name="update1" style="display: none;">
                            发现新版本 <span id="latest_version" name="latest_version"></span>  <a is="emby-linkbutton" id="upgrade" name="upgrade" href="#" class="upgrade button-link emby-button">立即更新</a>
                            <div class="fieldDescription">
                                <span id="latest_message" name="latest_message"></span>
                            </div>

                        <p class="description1" id="update2" name="update2" style="display: none;">
                            新版本已经下载，需要重启 Emby/Jellyfin Server 后生效。
                        </p>
                        <p class="description1" id="update3" name="update3" style="display: none;">
                            已经是最新版本了，<a is="emby-linkbutton" target="_blank" href="https://github.com/JavScraper/Emby.Plugins.JavScraper/releases/latest" class="button-link emby-button">版本说明</a>。
                        </p>
                    </div>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>代理服务器</h3></legend>

                        <div class="selectContainer">
                            <label class="selectLabel" for="selectProxyType">代理服务器类型：</label>
                            <select is="emby-select" id="selectProxyType" name="selectProxyType" label="代理服务器类型：" class="selectProxyType emby-select-withcolor emby-select">
                                <option value="-1">禁用</option>
                                <option value="0">JsProxy</option>
                                <option value="1">HTTP</option>
                                <option value="2">HTTPS</option>
                                <option value="3">Socks5</option>
                            </select>
                            <div class="selectArrowContainer">
                                <div style="visibility:hidden;display:none;">0</div>
                                <span class="selectArrow material-icons keyboard_arrow_down"></span>
                            </div>
                        </div>

                        <div id="selectProxyTypeJsProxy" name="selectProxyTypeJsProxy" class="selectProxyTypeJsProxy">
                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtJsProxy">修改版 JsProxy 代理地址:</label>
                                <input is="emby-input" type="url" id="txtJsProxy" name="txtJsProxy" class="emby-input">
                                <div class="fieldDescription">
                                    您需要使用 <a is="emby-linkbutton" href="https://workers.cloudflare.com" target="_blank" class="button-link emby-button">CloudFlare Workers</a> 部署修改版 JsProxy 代理服务，
                                    <a is="emby-linkbutton" target="_blank" href="https://github.com/JavScraper/Emby.Plugins.JavScraper/tree/master/cf-worker" class="button-link emby-button">了解更多</a>
                                </div>
                            </div>
                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtJsProxyBypass">不走代理的域名:</label>
                                <input is="emby-input" type="text" id="txtJsProxyBypass" name="txtJsProxyBypass" class="emby-input">
                                <div class="fieldDescription">采用关键字匹配方式，多个域名使用逗号隔开。</div>
                            </div>
                        </div>

                        <div id="selectProxyTypeProxy" name="selectProxyTypeProxy" class="selectProxyTypeProxy">
                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtProxyHost">服务器:</label>
                                <input is="emby-input" id="txtProxyHost" name="txtProxyHost" class="emby-input" label="服务器：">
                            </div>
                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtProxyPort">端口:</label>
                                <input is="emby-input" type="number" id="txtProxyPort" name="txtProxyPort" label="端口：" pattern="[0-9]*" required="required" min="1" max="65535" class="emby-input">
                            </div>
                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtProxyUserName">用户名:</label>
                                <input is="emby-input" id="txtProxyUserName" name="txtProxyUserName" class="emby-input" label="用户名：">
                            </div>

                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtProxyPassword">密码:</label>
                                <input is="emby-input" id="txtProxyPassword" name="txtProxyPassword" class="emby-input" label="密码：">
                            </div>

                            <div class="fieldDescription">
                                用户名和密码，可以为空。
                            </div>
                        </div>

                        <br>
                        <div>
                            <div class="checkboxContainer checkboxContainer-withDescription">
                                <label>
                                    <input type="checkbox" is="emby-checkbox" id="chkEnableX_FORWARDED_FOR">
                                    <span>增加 X-FORWARDED-FOR HTTP 请求头</span>
                                </label>
                                <div class="fieldDescription checkboxFieldDescription"></div>
                            </div>

                            <div class="inputContainer">
                                <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtX_FORWARDED_FOR">X-FORWARDED-FOR IP地址：</label>
                                <input is="emby-input" id="txtX_FORWARDED_FOR" name="txtX_FORWARDED_FOR" class="emby-input" label="X-FORWARDED-FOR IP地址：">
                            </div>

                            <div class="fieldDescription">增加 X-FORWARDED-FOR HTTP 请求头的作用在于伪造来源IP地址，以突破区域限制。常用同一个也可能导致被封锁。这个功能仅部分网站有效。</div>
                        </div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>刮削器配置</h3></legend>

                        <div class="checkboxList paperList checkboxList-paperList" id="Scrapers" name="Scrapers">
                            <div class="listItem listItem-border sortableOption sortItem" data-sort="0">
                                <label class="listItemCheckboxContainer emby-checkbox-label">
                                    <input type="checkbox" is="emby-checkbox" class="chkEnableCodec emby-checkbox emby-checkbox-focusring" data-codec="a">
                                    <span class="checkboxLabel">AAAA</span>
                                </label>
                                <div class="listItemBody two-line listItemBodyText"></div>
                                <button type="button" is="paper-icon-button-light" title="上" class="btnSortable paper-icon-button-light btnSortableMoveUp btnViewItemUp" data-pluginindex="2"><span class="material-icons keyboard_arrow_up"></span></button>
                                <button type="button" is="paper-icon-button-light" title="下" class="btnSortable paper-icon-button-light btnSortableMoveDown btnViewItemDown" data-pluginindex="0"><span class="material-icons keyboard_arrow_down"></span></button>
                            </div>
                            <div class="listItem listItem-border sortableOption sortItem" data-sort="1">
                                <label class="listItemCheckboxContainer emby-checkbox-label">
                                    <input type="checkbox" is="emby-checkbox" class="chkEnableCodec emby-checkbox emby-checkbox-focusring" data-codec="b">
                                    <span class="checkboxLabel">BBBB</span>
                                </label>
                                <div class="listItemBody two-line listItemBodyText"></div>
                                <button type="button" is="paper-icon-button-light" title="上" class="btnSortable paper-icon-button-light btnSortableMoveUp btnViewItemUp" data-pluginindex="2"><span class="material-icons keyboard_arrow_up"></span></button>
                                <button type="button" is="paper-icon-button-light" title="下" class="btnSortable paper-icon-button-light btnSortableMoveDown btnViewItemDown" data-pluginindex="0"><span class="material-icons keyboard_arrow_down"></span></button>
                            </div>
                            <div class="listItem listItem-border sortableOption sortItem" data-sort="2">
                                <label class="listItemCheckboxContainer emby-checkbox-label">
                                    <input type="checkbox" is="emby-checkbox" class="chkEnableCodec emby-checkbox emby-checkbox-focusring" data-codec="c">
                                    <span class="checkboxLabel">CCCC</span>
                                </label>
                                <div class="listItemBody two-line listItemBodyText"></div>
                                <button type="button" is="paper-icon-button-light" title="上" class="btnSortable paper-icon-button-light btnSortableMoveUp btnViewItemUp" data-pluginindex="2"><span class="material-icons keyboard_arrow_up"></span></button>
                                <button type="button" is="paper-icon-button-light" title="下" class="btnSortable paper-icon-button-light btnSortableMoveDown btnViewItemDown" data-pluginindex="0"><span class="material-icons keyboard_arrow_down"></span></button>
                            </div>
                        </div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>采集配置</h3></legend>


                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtIgnoreGenre">移除以下标签:</label>
                            <input is="emby-input" type="text" id="txtIgnoreGenre" name="txtIgnoreGenre" class="emby-input">
                            <div class="fieldDescription">自动移除以上标签，用逗号隔开。</div>
                        </div>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkGenreIgnoreActor">
                                <span>移除标签中的女优名字</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkTitleIgnoreActor">
                                <span>从标题结尾处移除女优的名字</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkAddChineseSubtitleGenre">
                                <span>给 -C 或 -C2 结尾的影片增加“中文字幕”标签</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>标题格式</h3></legend>

                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtTitleFormat">标题格式:</label>
                            <input is="emby-input" type="text" id="txtTitleFormat" name="txtTitleFormat" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtTitleFormatEmptyValue">若参数为空时，则显示为:</label>
                            <input is="emby-input" type="text" id="txtTitleFormatEmptyValue" name="txtTitleFormatEmptyValue" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div>
                            <b>支持的参数列表:</b>
                            <ul>
                                <li>%num% : 番号</li>
                                <li>%title% : 标题</li>
                                <li>%title_original% : 未翻译的原始标题</li>
                                <li>%actor% : 演员</li>
                                <li>%actor_first% : 第一个演员</li>
                                <li>%set% : 系列</li>
                                <li>%director% : 导演</li>
                                <li>%date% : 发行日期</li>
                                <li>%year% : 发行年份</li>
                                <li>%month% : 发行月份</li>
                                <li>%studio% : 制作组</li>
                                <li>%maker% : 厂商</li>
                                <li>%genre:A?B:C% : 类别。当存在类别A时值为B，否则值为C；B和C可以为空。示例 %genre:中文字幕?中文:%</li>
                            </ul>
                        </div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>封面剪裁</h3></legend>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkEnableBaiduBodyAnalysis">
                                <span>使用百度人体分析接口进行精确剪裁</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtBaiduBodyAnalysisApiKey">API Key:</label>
                            <input is="emby-input" type="text" id="txtBaiduBodyAnalysisApiKey" name="txtBaiduBodyAnalysisApiKey" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtBaiduBodyAnalysisSecretKey">Secret Key:</label>
                            <input is="emby-input" type="text" id="txtBaiduBodyAnalysisSecretKey" name="txtBaiduBodyAnalysisSecretKey" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="fieldDescription">强烈推荐配置此功能！这些功能需要自行申请百度人体分析接口，并填写 API Key 和 Secret Key。<a is="emby-linkbutton" class="button-link lnkSupporterLearnMore emby-button" href="https://ai.baidu.com/tech/body" target="_blank">了解更多</a></div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>女优头像</h3></legend>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkEnableCutPersonImage">
                                <span>按比例剪裁女优头像</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                        <div class="fieldDescription">按比例剪裁能让头像在 Emby 中显示不变形，但会有部分内容被裁掉。女优头像数据源来自 <a is="emby-linkbutton" class="button-link lnkSupporterLearnMore emby-button" href="https://github.com/xinxin8816/gfriends" target="_blank">女友头像仓库</a>。</div>

                        <br>
                        <div class="description1">
                            <b>立即采集缺失的女优头像</b>：请到 <a data-navmenuid='/scheduledtasks' is='emby-linkbutton' class='button-link emby-button' href='/scheduledtasks' title=' 高级 - 计划任务 - JavScraper '> 高级 - 计划任务 - JavScraper </a> 中找到 <b>JavScraper: 立即采集缺失的女优头像</b>，点击右边的 <i class="md-icon">play_arrow</i> 开始执行。
                        </div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>翻译</h3></legend>

                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkEnableBaiduFanyi">
                                <span>开启百度翻译</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                        <div class="selectContainer">
                            <label class="selectLabel" for="selectBaiduFanyiLanguage">目标语言：</label>
                            <select is="emby-select" id="selectBaiduFanyiLanguage" name="selectBaiduFanyiLanguage" label="代理服务器类型：" class="selectBaiduFanyiLanguage emby-select-withcolor emby-select">
                                <option value="zh">中文</option>
                                <option value="cht">繁体中文</option>
                                <option value="en">英文</option>
                            </select>
                            <div class="selectArrowContainer">
                                <div style="visibility:hidden;display:none;">0</div>
                                <span class="selectArrow material-icons keyboard_arrow_down"></span>
                            </div>
                        </div>
                        <div class="selectContainer">
                            <label class="selectLabel">翻译内容：</label>
                            <div class="checkboxContainer checkboxContainer-withDescription">
                                <label>
                                    <input type="checkbox" is="emby-checkbox" id="chkEnableBaiduFanyiOptionsName">
                                    <span>标题</span>
                                </label>
                                <div class="fieldDescription checkboxFieldDescription"></div>
                            </div>
                            <div class="checkboxContainer checkboxContainer-withDescription">
                                <label>
                                    <input type="checkbox" is="emby-checkbox" id="chkEnableBaiduFanyiOptionsGenre">
                                    <span>类别 （不推荐）</span>
                                </label>
                                <div class="fieldDescription checkboxFieldDescription"></div>
                            </div>
                            <div class="checkboxContainer checkboxContainer-withDescription">
                                <label>
                                    <input type="checkbox" is="emby-checkbox" id="chkEnableBaiduFanyiOptionsPlot">
                                    <span>简介</span>
                                </label>
                                <div class="fieldDescription checkboxFieldDescription"></div>
                            </div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtBaiduFanyiApiKey">API Key:</label>
                            <input is="emby-input" type="text" id="txtBaiduFanyiApiKey" name="txtBaiduFanyiApiKey" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtBaiduFanyiSecretKey">Secret Key:</label>
                            <input is="emby-input" type="text" id="txtBaiduFanyiSecretKey" name="txtBaiduFanyiSecretKey" class="emby-input">
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="fieldDescription">这功能需要自行申请百度翻译接口，并填写 API Key 和 Secret Key。<a is="emby-linkbutton" class="button-link lnkSupporterLearnMore emby-button" href="https://fanyi-api.baidu.com/" target="_blank">了解更多</a></div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>影片类别</h3></legend>


                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkEnableGenreReplace">
                                <span>开启类别替换</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtGenreReplaceMap">类别替换表:</label>
                            <textarea rows="10" is="emby-input" type="text" id="txtGenreReplaceMap" name="txtGenreReplaceMap" class="emby-input"></textarea>
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="fieldDescription">该功能优先级高于百度翻译中的类别翻译项。每行一条记录，两个类别之间用小写的冒号隔开，当目标类别为XXXX时，表示去除该类别。</div>
                    </fieldset>

                    <fieldset class="verticalSection verticalSection-extrabottompadding">
                        <legend><h3>演员姓名</h3></legend>


                        <div class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input type="checkbox" is="emby-checkbox" id="chkEnableActorReplace">
                                <span>开启演员姓名替换</span>
                            </label>
                            <div class="fieldDescription checkboxFieldDescription"></div>
                        </div>
                        <div class="inputContainer">
                            <label class="inputLabel inputLabel-float inputLabelUnfocused" for="txtActorReplaceMap">演员姓名替换表:</label>
                            <textarea rows="10" is="emby-input" type="text" id="txtActorReplaceMap" name="txtActorReplaceMap" class="emby-input"></textarea>
                            <div class="fieldDescription"></div>
                        </div>
                        <div class="fieldDescription">每行一条记录，两个演员姓名之间用小写的冒号隔开，当目标演员姓名为XXXX时，表示去除该演员姓名。</div>
                    </fieldset>
                    <br>

                    <div>
                        <button is="emby-button" type="submit" class="raised button-submit block emby-button"><span>保存</span></button>
                    </div>
                </form>
            </div>
        </div>
        <script type="text/javascript">

            var JavScraperConfigurationPage = {
                pluginUniqueId: "0f34b81a-4af7-4719-9958-4cb8f680e7c6"
            };

            $('.upgrade').on('click', function (e) {
                Dashboard.showLoadingMsg();
                var page = this;
                ApiClient.getJSON('/emby/Plugins/JavScraper/Update?update=true').then(function (data) {
                    console.log(data);
                    Dashboard.hideLoadingMsg();
                    var state = data.State;
                    $('#update', page).attr("style", "display:none;");
                    $('#update1', page).attr("style", "display:none;");
                    if (state == 0) {
                        $('#update0', page).attr("style", "");
                        $('#update_error', page).text(data.ErrorMessage);
                    } else if (state == 1) {
                        $('#update1', page).attr("style", "");
                        $('#latest_version', page).text('v' + data.LatestVersion);
                        $('#latest_message', page).html(data.UpdateMessage.replace(/\r\n/g, "<br />").replace(/\n/g, "<br />"));
                    } else if (state == 2) {
                        $('#update2', page).attr("style", "");
                    } else {
                        $('#update3', page).attr("style", "");
                    }
                    if (data.Success == true) {
                        Dashboard.alert({
                            title: "下载完成",
                            message: "新版本已经下载，需要重启 Emby/Jellyfin Server 后生效。"
                        });
                    } else {
                        Dashboard.alert({
                            title: "下载失败",
                            message: data.ErrorMessage
                        });
                    }
                });
            });

            $('.selectProxyType').on('change', function (e) {
                if (this.value < 0) {
                    $('.selectProxyTypeJsProxy').css('display', 'none');
                    $('.selectProxyTypeProxy').css('display', 'none');
                } else if (this.value == 0) {
                    $('.selectProxyTypeJsProxy').css('display', 'inherit');
                    $('.selectProxyTypeProxy').css('display', 'none');
                } else {
                    $('.selectProxyTypeJsProxy').css('display', 'none');
                    $('.selectProxyTypeProxy').css('display', 'inherit');
                }
            });

            $('.JavScraperConfigurationPage').on('pageshow', function (event) {
                Dashboard.showLoadingMsg();
                var page = this;
                ApiClient.getJSON('/emby/Plugins/JavScraper/Update').then(function (data) {
                    console.log(data);
                    var state = data.State;
                    $('#update', page).attr("style", "display:none;");
                    if (state == 0) {
                        $('#update0', page).attr("style", "");
                        $('#update_error', page).text(data.ErrorMessage);
                    } else if (state == 1) {
                        $('#update1', page).attr("style", "");
                        $('#latest_version', page).text('v' + data.LatestVersion);
                        $('#latest_message', page).html(data.UpdateMessage.replace(/\r\n/g, "<br />").replace(/\n/g, "<br />"));
                    } else if (state == 2) {
                        $('#update2', page).attr("style", "");
                    } else {
                        $('#update3', page).attr("style", "");
                    }
                });
                ApiClient.getPluginConfiguration(JavScraperConfigurationPage.pluginUniqueId).then(function (config) {
                    $('#current_version', page).text("v" + config.Version);

                    //page.querySelector('#chkEnableJsProxy').checked = config.EnableJsProxy;
                    $('#txtJsProxy', page).val(config.JsProxy).change();
                    $('#txtJsProxyBypass', page).val(config.JsProxyBypass).change();

                    $('#txtProxyHost', page).val(config.ProxyHost).change();
                    $('#txtProxyPort', page).val(config.ProxyPort).change();
                    $('#txtProxyUserName', page).val(config.ProxyUserName).change();
                    $('#txtProxyPassword', page).val(config.ProxyPassword).change();

                    $('#selectProxyType', page).val(config.ProxyType).change();

                    page.querySelector('#chkEnableX_FORWARDED_FOR').checked = config.EnableX_FORWARDED_FOR;
                    $('#txtX_FORWARDED_FOR', page).val(config.X_FORWARDED_FOR).change();

                    $('#txtIgnoreGenre', page).val(config.IgnoreGenre).change();
                    page.querySelector('#chkGenreIgnoreActor').checked = config.GenreIgnoreActor;
                    page.querySelector('#chkTitleIgnoreActor').checked = config.TitleIgnoreActor;
                    page.querySelector('#chkAddChineseSubtitleGenre').checked = config.AddChineseSubtitleGenre;

                    $('#txtTitleFormat', page).val(config.TitleFormat).change();
                    $('#txtTitleFormatEmptyValue', page).val(config.TitleFormatEmptyValue).change();

                    page.querySelector('#chkEnableBaiduBodyAnalysis').checked = config.EnableBaiduBodyAnalysis;
                    $('#txtBaiduBodyAnalysisApiKey', page).val(config.BaiduBodyAnalysisApiKey).change();
                    $('#txtBaiduBodyAnalysisSecretKey', page).val(config.BaiduBodyAnalysisSecretKey).change();
                    page.querySelector('#chkEnableCutPersonImage').checked = config.EnableCutPersonImage;

                    page.querySelector('#chkEnableBaiduFanyi').checked = config.EnableBaiduFanyi;
                    $('#selectBaiduFanyiLanguage', page).val(config.BaiduFanyiLanguage).change();
                    $('#txtBaiduFanyiApiKey', page).val(config.BaiduFanyiApiKey).change();
                    $('#txtBaiduFanyiSecretKey', page).val(config.BaiduFanyiSecretKey).change();
                    page.querySelector('#chkEnableBaiduFanyiOptionsName').checked = (config.BaiduFanyiOptions & (1 << 0)) != 0;
                    page.querySelector('#chkEnableBaiduFanyiOptionsGenre').checked = (config.BaiduFanyiOptions & (1 << 1)) != 0;
                    page.querySelector('#chkEnableBaiduFanyiOptionsPlot').checked = (config.BaiduFanyiOptions & (1 << 2)) != 0;

                    page.querySelector('#chkEnableGenreReplace').checked = config.EnableGenreReplace;
                    $('#txtGenreReplaceMap', page).val(config.GenreReplaceMap).change();

                    page.querySelector('#chkEnableActorReplace').checked = config.EnableActorReplace;
                    $('#txtActorReplaceMap', page).val(config.ActorReplaceMap).change();

                    var html = '';
                    config.Scrapers.forEach(function (e) {
                        html += '<div class="listItem listItem-border sortableOption sortItem" data-sort="' + e + '">';
                        html += '    <label class="listItemCheckboxContainer emby-checkbox-label">';
                        html += '        <input type="checkbox" is="emby-checkbox" class="chkEnableCodec emby-checkbox emby-checkbox-focusring" name="JavScraperItem" ' + (e.Enable ? 'checked' : '') + ' value="' + e.Name + '" >';
                        html += '        <span class="checkboxLabel" style="width:200px" >' + e.Name + '</span>';
                        html += '        <input is="emby-input" type="url" name="Url" class="emby-input" label="服务器：" value="' + e.Url + '">';
                        html += '    </label>';
                        html += '    <div class="listItemBody two-line listItemBodyText"></div>';
                        html += '    <button type="button" is="paper-icon-button-light" title="上" class="btnSortable paper-icon-button-light btnSortableMoveUp btnViewItemUp" data-pluginindex="2"><span class="material-icons keyboard_arrow_up"></span></button>';
                        html += '    <button type="button" is="paper-icon-button-light" title="下" class="btnSortable paper-icon-button-light btnSortableMoveDown btnViewItemDown" data-pluginindex="0"><span class="material-icons keyboard_arrow_down"></span></button>';
                        html += '</div>';
                        html += '\r\n';
                    });

                    //console.log(html);
                    $('#Scrapers', page).empty().append(html);
                    setButtons();

                    Dashboard.hideLoadingMsg();
                });
            });

            $('.JavScraperConfigurationForm').on('submit', function (e) {
                Dashboard.showLoadingMsg();
                var form = this;
                ApiClient.getPluginConfiguration(JavScraperConfigurationPage.pluginUniqueId).then(function (config) {
                    //config.EnableJsProxy = $('#chkEnableJsProxy').prop('checked');
                    config.ProxyType = $('#selectProxyType', form).val();
                    config.JsProxy = $('#txtJsProxy', form).val();
                    config.JsProxyBypass = $('#txtJsProxyBypass', form).val();

                    config.ProxyHost = $('#txtProxyHost', form).val();
                    config.ProxyPort = $('#txtProxyPort', form).val();
                    config.ProxyUserName = $('#txtProxyUserName', form).val();
                    config.ProxyPassword = $('#txtProxyPassword', form).val();

                    config.EnableX_FORWARDED_FOR = $('#chkEnableX_FORWARDED_FOR').prop('checked');
                    config.X_FORWARDED_FOR = $('#txtX_FORWARDED_FOR', form).val();

                    config.IgnoreGenre = $('#txtIgnoreGenre', form).val();
                    config.GenreIgnoreActor = $('#chkGenreIgnoreActor').prop('checked');
                    config.TitleIgnoreActor = $('#chkTitleIgnoreActor').prop('checked');
                    config.AddChineseSubtitleGenre = $('#chkAddChineseSubtitleGenre').prop('checked');

                    config.TitleFormat = $('#txtTitleFormat', form).val();
                    config.TitleFormatEmptyValue = $('#txtTitleFormatEmptyValue', form).val();

                    config.EnableBaiduBodyAnalysis = $('#chkEnableBaiduBodyAnalysis').prop('checked');
                    config.BaiduBodyAnalysisApiKey = $('#txtBaiduBodyAnalysisApiKey', form).val();
                    config.BaiduBodyAnalysisSecretKey = $('#txtBaiduBodyAnalysisSecretKey', form).val();
                    config.EnableCutPersonImage = $('#chkEnableCutPersonImage').prop('checked');

                    config.EnableBaiduFanyi = $('#chkEnableBaiduFanyi').prop('checked');
                    config.BaiduFanyiLanguage = $('#selectBaiduFanyiLanguage', form).val();
                    config.BaiduFanyiApiKey = $('#txtBaiduFanyiApiKey', form).val();
                    config.BaiduFanyiSecretKey = $('#txtBaiduFanyiSecretKey', form).val();
                    config.BaiduFanyiOptions = 0;
                    if ($('#chkEnableBaiduFanyiOptionsName').prop('checked'))
                        config.BaiduFanyiOptions |= (1 << 0);
                    if ($('#chkEnableBaiduFanyiOptionsGenre').prop('checked'))
                        config.BaiduFanyiOptions |= (1 << 1);
                    if ($('#chkEnableBaiduFanyiOptionsPlot').prop('checked'))
                        config.BaiduFanyiOptions |= (1 << 2);

                    config.EnableGenreReplace = $('#chkEnableGenreReplace').prop('checked');
                    config.GenreReplaceMap = $('#txtGenreReplaceMap', form).val();

                    config.EnableActorReplace = $('#chkEnableActorReplace').prop('checked');
                    config.ActorReplaceMap = $('#txtActorReplaceMap', form).val();

                    var scrapers = [];
                    $('input[name=JavScraperItem]').each(function (index) {
                        var scraper = new Object();
                        scraper.Name = $(this).prop('value');
                        scraper.Enable = $(this).prop('checked');
                        scraper.Url = $(this).parent().find('input[name=Url]').prop('value');
                        scrapers.push(scraper);
                    });
                    config.Scrapers = scrapers;

                    ApiClient.updatePluginConfiguration(JavScraperConfigurationPage.pluginUniqueId, config).then(Dashboard.processPluginConfigurationUpdateResult);
                });
                // Disable default form submission
                return false;
            });

            function setButtons() {
                $('.sortItem button').css('visibility', 'visible')
                $('.sortItem:first-child button.btnViewItemUp').css('visibility', 'hidden')
                $('.sortItem:last-child button.btnViewItemDown').css('visibility', 'hidden')
                $(".sortItem").addClass("listItem-border");
                $(".sortItem:last-child").removeClass("listItem-border");
                var i = 0;
                $('.sortItem').each(function () {
                    $(this).attr("data-sort", i);
                    i++;
                });
            }

            $(document).ready(function () {
                setButtons();
                $(document).on('click', '.btnViewItemDown', function (e) {
                    var cCard = $(this).closest('.sortItem');
                    var tCard = cCard.next('.sortItem');
                    cCard.insertAfter(tCard);
                    setButtons();
                });

                $(document).on('click', '.btnViewItemUp', function (e) {
                    var cCard = $(this).closest('.sortItem');
                    var tCard = cCard.prev('.sortItem');
                    cCard.insertBefore(tCard);
                    setButtons();
                });
            });
        </script>
    </div>
</body>
</html>